<template>
	<gracePage :customHeader="false">
		<!-- 页面主体 -->
		<view slot="gBody">
		<!-- 页面內容 -->
		<view class="grace-rows" style="margin-top: 20rpx; width:750rpx;height:120rpx;background:rgba(255,255,255,1);">
			<view style=" margin-left: 40rpx; font-size:28rpx;font-weight:400;color:rgba(51,51,51,1);line-height: 120rpx;">抵用券编码：</view>
			<view style="font-size:28rpx;font-weight:400;color:rgba(51,51,51,1);line-height: 120rpx;margin-left: 75rpx;">{{ diyongquanbianma }}</view>
		</view>
		
		<view class="grace-rows" style="margin-top: 4rpx; width:750rpx;height:120rpx;background:rgba(255,255,255,1);">
			<view style=" margin-left: 40rpx; font-size:28rpx;font-weight:400;color:rgba(51,51,51,1);line-height: 120rpx;">转让对象：</view>
			<view style="position: relative;top: 35rpx;left: 20rpx;">
				<input v-model="phone" placeholder="请输入对方手机号码" type="number"/>
				<view style="position: relative;top: 10rpx; width:400rpx;height:1rpx;background:rgba(153,153,153,1);"></view>
			</view>
		</view>
		
		<view @tap="querenzhuangrang()" style="margin: 0 auto;position: relative;top: 290rpx; width:500rpx;height:90rpx;background:rgba(218,28,30,1);border-radius:6rpx;font-size:32rpx;font-weight:400;color:rgba(255,255,255,1);line-height: 90rpx;text-align: center;">确认</view>
		
		</view>
	</gracePage>
</template>

<script>
	import gracePage from "../../graceUI/components/gracePage.vue";
	export default {
		data() {
			return {
				quan_id:'',
				diyongquanbianma:'',
				phone:'',
			}
		},
		onLoad:function(opt){
			this.diyongquanbianma=opt.diyongquanbianma;
			this.quan_id=opt.quan_id;
		},
		methods:{
			querenzhuangrang(){
				var vm=this;
				if(vm.phone===''){
					vm.msg_show('请填写转让手机号');
				}else{
					vm.req.post(
					vm.lochost+'/mytrunk/discounts/transfer_the_possession',
					{id:vm.quan_id,
					phone:vm.phone
					},
					{},
					function(res){
						vm.msg_show(res.msg);
						vm.Back();
					}
					)
				}
			}
		},
		components:{
			gracePage
		}
	}
</script>

<style>
</style>


<!-- .grace-flex // 声明 flex
.grace-rows // flex 横向
.grace-columns  //flex 竖向
.grace-wrap //flex 自动换行
.grace-nowrap //flex 横向不换行
.grace-space-between //flex 横向两端对齐
.grace-flex-end //flex 横向右对齐
.grace-flex-center  //flex 横向居中
.grace-flex-top  //flex 垂直顶端对齐
.grace-flex-vcenter //flex 垂直居中对齐
.grace-flex-bottom //flex 垂直底部对齐
.grace-no-scale //元素不缩放 -->
